<template>
  <div class="feedback">
    <div class="title">意见与反馈</div>
    <van-form @submit="onSubmit">
      <van-field
        v-model="formData.content"
        rows="2"
        autosize
        label="留言"
        type="textarea"
        maxlength="150"
        placeholder="请填写你的意见和反馈"
        show-word-limit
        :rules="[{ required: true }]"
      />
      <van-field
        v-model="formData.phone"
        label="联系方式"
        placeholder="邮箱/手机号/微信号"
        :rules="[{ required: true }]"
      />
      <div style="margin: 16px">
        <van-button block type="info" native-type="submit" color="#b4282d"
          >提交</van-button
        >
      </div>
    </van-form>
  </div>
</template>
<script>
import { submitAction } from "@/api/mine/feedback/index";
export default {
  data() {
    return {
      formData: {
        content: "",
        phone: "",
      },
    };
  },
  methods: {
    async onSubmit() {
      const userInfo = JSON.parse(localStorage.getItem("userInfo"));
      const { data } = await submitAction({
        ...this.formData,
        name: userInfo.nickName,
        openId: localStorage.getItem("openId"),
      });
      if (data) {
        this.$toast("提交成功");
        this.formData = {
          content: "",
          phone: "",
        };
      } else {
        this.$toast("网络不佳,请稍后再试~");
      }
    },
  },
};
</script>
<style lang="scss" scoped>
@import "./index.scss";
</style>
